<template>
  <flex class="header" height="50px">
    <flex-item class="left" col="20%"><span class="iconfont icon-arrow_left"></span></flex-item>
    <flex-item class="center" col="60%"><span>{{title}}</span></flex-item>
    <flex-item class="right" col="20%"></flex-item>
  </flex>
</template>

<script>
    import flex from '@/components/layout/flex';
    import flexItem from '@/components/layout/flexItem';
    export default {
      name: "headers",
      props:{
        title:''
      },
      components:{
        flex,
        flexItem
      }
    }
</script>

<style lang="less" scoped>
  .iconfont{
    font-size: 4.6rem;
  }
  .flex{
    font-size: 2.6rem;
    background-color: #cccccc;
  }
  .flex-item{
    line-height: 50px;
  }

</style>
